<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>添加角色</title>
    <link rel="stylesheet" href="../../../../start/layui/css/layui.css" media="all">
</head>
<body>
<div class="layui-fluid" style="padding: 15px">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">
                    添加角色数据
                </div>
                <div class="layui-card-body">
                    <form class="layui-form" action="#"  lay-filter="example">
                        <div class="layui-form-item">
                            <label class="layui-form-label">角色名称：</label>
                            <div class="layui-input-inline">
                                <input type="text" name="rolename" id="rolename" required lay-verify="required" placeholder="请输入名称" autocomplete="off" class="layui-input">
                            </div>
                            <div class="layui-form-mid layui-word-aux">建议：见名知意</div>
                        </div>
                        <div class="layui-form-item layui-form-text">
                            <label class="layui-form-label">角色描述：</label>
                            <div class="layui-input-block">
                                <textarea name="roledescribe" id="roledescribe" placeholder="请输入内容" class="layui-textarea"></textarea>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div id="test1" style="width:100%;float:left;background: #92B8B1"></div><br/>
                        </div>
                        <input type="hidden" id="genre" value="添加">
                        <input type="hidden" name="roleId" id="roleId" value="">
                        <div class="layui-btn-container">
                            <button type="button" class="layui-btn layui-btn-sm" lay-demo="reload">重载</button>
                            <button type="button" class="layui-btn layui-btn-sm" lay-submit lay-filter="addRole">提交数据</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>
<script src="../../../../start/layui/layui.js"></script>
<script>
    layui.use(['table', 'form', 'jquery', 'layer', 'tree','util'], function () {
        var tree = layui.tree
            ,$ = layui.jquery
            ,table = layui.table
            ,util = layui.util
            ,form = layui.form
            ,layer = layui.layer;
        /*树形菜单组件*/
        $.ajax({
            type: 'get',
            url: '../../../../TreeForm',
            datatype: 'json',
            success: function (data) {
                console.log(data)
                //渲染
                tree.render({
                    elem: '#test1'  //绑定元素
                    ,id:"treeMenu"
                    ,showCheckbox:true
                    , data: data
                });
            }
        })





        //按钮事件
        util.event('lay-demo', {
            getChecked: function(othis){
                var checkData = tree.getChecked('treeMenu');
                var list = new Array();
                list = getChecked_list(checkData);
                console.log(checkData)
                console.log(list);
            }
            ,setChecked: function(){
                tree.setChecked('treeMenu', [12, 16]); //勾选指定节点
            }
            ,reload: function(){
                //重载实例
                tree.reload('treeMenu', {
                });
            }
            ,addRole: function(){

            }
        });

        //提交数据
        form.on('submit(addRole)', function(data){
            //获取树形结构图
            var checkData = tree.getChecked('treeMenu');
            //得到id树形结构图选中id
            var list = getChecked_list(checkData);
            //把选中id存入 data
            data.field.menuS = list;
            //表单提交

            if ($("#genre").val()=="修改"){
                $.ajax({
                    type: "POST",
                    url:  '../../../../updateRole',
                    dataType: "text",
                    data:data.field,
                    success: function(data){
                    }
                });
            }else {
                alert("添加")
                $.ajax({
                    type: "POST",
                    url:  '../../../../AddRole',
                    dataType: "text",
                    data:data.field,
                    success: function(data){
                    }
                });
            }



            layer.msg($("#genre").val()+'成功,即将关闭...');
            setTimeout(function(){//设置定时器
                window.parent.location.reload();//刷新父页面
                //获取当前窗口名称
                //当你在iframe页面关闭自身时
                var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                parent.layer.close(index); //再执行关闭
            },1000);

            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });

        // 获取选中节点的id
        function getChecked_list(data) {
            var id = "";
            $.each(data, function (index, item) {
                if (id != "") {
                    id = id + "," + item.id;
                }
                else {
                    id = item.id;
                }
                var i = getChecked_list(item.children);
                if (i != "") {
                    id = id + "," + i;
                }
            });
            return id;
        }

    })
</script>